<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
       
    </style>
</head>
<body>
    <form action="地址" method="提交方式">
        <!-- label标签，作用：点击附近文字也能选中 -->
        <label>
            <input type="radio" value="man"/>人
        </label>
        <!-- 文本框 -->
        <input type="text" value="jack" readonly />
        <!-- 密码框 -->
        <!-- 另一种形式：input[type="password"] -->
        <input type="password" required placeholder="请确认密码" />
        <!-- 数字输入框 -->
        <input type="number" min="10" max="100" step="10" />
        <!-- 单选框 radio 要想实现单选效果必须加入name属性 -->
        <input type="radio" value="male" name="gander"/>男
        <input type="radio" value="female" name="gander" />女
        <!-- 多选 -->
        <input type="checkbox" name="hobby" value="eat"/>
        <input type="checkbox" name="hobby" value="sleep"/>
        <input type="checkbox" name="hobby" value="steam"/>
        <!-- 文件上传 file -->
        <input type="file" />
        <!-- 重置按钮 清空表单内的所有用户输入的数据,恢复到默认状态 -->
        <input type="reset" value="重置">
        <!-- 按钮 -->
        <input type="button" value="普通按钮">
        <!-- 提交 -->
        <input type="submit" value="提交">
    </form>
    <form action="地址" >
        <!--select表示默认选中的元素  -->
        <select>
            <option value="4399">4399小游戏</option>
            <option value="4399">7k7k小游戏</option>
        </select>
  
        <!-- 给出下拉分组 optgroup-->
       
    <select>
        <optgroup label="游戏">
            <option value="fps">apex</option>
            <option value="flash">4399</option>
            <option value="moba">LOL</option>
        </optgroup>
        <optgroup label="游戏商城">
            <option value="epic">E宝</option>
            <option value="orgin">橘子</option>
            <option value="ea">EA</option>
        </optgroup>
    </select>
    </form>
    
    <form action="地址" method="提交方式">
<!-- 
    cols和rows
    column列
row行并不是限制文本域内的行列数，而是控制文本域的框高 -->
<textarea name="" id="" cols="30" rows="10"></textarea>

    </form>
    
    
    
</body>
</html>